<template>
  <div>
    <div>
      <div class="test">
        <b>曹华珠</b>
      </div>
      <div class="test2">
        <b>15140A01</b>
      </div>
    </div>
    <img src="../assets/bggr.jpg" width="100%" height="200px"/>
    <img src="../assets/avatur.jpg" class="avatur" width="75px" height="75px"/>
    <div class="item1" @click="goList">
      <van-icon name="sign"/>
      <b class="jilu">
        测试记录</b>
    </div>
    <div class="item" @click="clsMsg">
      <van-icon name="edit-data"/>
      <b class="jilu">
        班级信息</b>
    </div>
    <div class="item">
      <van-icon name="setting"/>
      <b class="jilu">
        设置</b>
    </div>
    <div class="navbar">
      <nav-tab-bar></nav-tab-bar>
    </div>
  </div>

</template>

<script>
  import VanIcon from "vant/packages/icon/index";
  import NavTabBar from "./NavTabBar";

  export default {
    components: {VanIcon, NavTabBar},
    name: "person-msg",
    methods: {
      goList: function () {

        // this.$http.get('http://193.112.6.35:8080/user/listUser')
        //   .then(res => {
        //     this.$router.push({path: '/classMsg'})
        //     console.log(res)
        //   }).catch(err => {
        //   console.log(err)
        // })

        this.$http.get('page/listScore', {
          params: {
            'studentId': '1514010632'
          }
        })
          .then(res => {
            this.$router.push({path: '/scoreMsg'})
            console.log(res)
          }).catch(err => {
          console.log(err)
        })
      },
      clsMsg: function () {
        this.$http.post('user/login', {
          id: 0,
          password: "111111",
          status: 0,
          username: "1514010632"
        }, {
          emulateJSON: true
        })
          .then(res => {
            this.$router.push({path: '/classMsg'})
            console.log(res)
          })
          .catch(err => {
            console.log(err)
          })
      }
    },
    data() {
      return {
        active: 2
      }
    }
  }
</script>

<style scoped>
  .lrj {
    position: absolute;
    top: 8%;
    background-color: rgba(209, 209, 209, 0.5);
    width: 13%;
    height: 42px;
  }

  .pmsg {
    position: absolute;
    left: 13%;
    top: 8%;
    text-shadow: 0 0 10px #eeeeee;
    font-size: 25px;
    color: rgba(118, 118, 118, 0.5);
    background-color: rgba(209, 209, 209, 0.5);
    padding: 3px 5px 3px 0;
  }

  .lrj2 {
    position: absolute;
    top: 15%;
    background-color: rgba(209, 209, 209, 0.5);
    width: 13%;
    height: 32px;
  }

  .pmsg2 {
    position: absolute;
    left: 13%;
    top: 15%;
    text-shadow: 0 0 10px #eeeeee;
    font-size: 20px;
    color: rgba(118, 118, 118, 0.5);
    background-color: rgba(209, 209, 209, 0.5);
    padding: 3px;
  }

  .test {
    position: absolute;
    top: 13%;
    left: 40%;
    text-shadow: 0 0 10px #eeeeee;
    font-size: 25px;
    color: rgba(87, 87, 87, 0.5);
  }

  .test2 {
    position: absolute;
    top: 18%;
    left: 36%;
    text-shadow: 0 0 10px #eeeeee;
    font-size: 20px;
    color: rgba(87, 87, 87, 0.5);
  }

  .avatur {
    border-radius: 50%;
    box-shadow: 0 0 10px #ffebf8;
    position: absolute;
    top: 160px;
    left: 40%;
  }

  .item {
    width: 100%;
    height: 40px;
    box-shadow: 0 0 3px #a89ba3;
    font-size: 20px;
    padding: 12px 0 0 15px;
    color: dimgrey;
  }

  .item1 {
    width: 100%;
    height: 40px;
    margin-top: 60px;
    box-shadow: 0 0 3px #a89ba3;
    font-size: 20px;
    padding: 12px 0 0 15px;
    color: dimgrey;
  }

  .jilu {
    margin-left: 9px;
    font-size: 19px;
  }
</style>
